<template>
  <a-modal :visible="visible" @cancel="cancle" width="80%" :footer="null">
    <a-card>
      <template #title>
        <div style="font-weight: bolder; font-size: 20px">
          <!-- 1 待审核 2已通过 3拒绝 -->
          <span v-if="user.status == 1">待审核</span>
          <span v-if="user.status == 2">已通过</span>
          <span v-if="user.status == 3">已拒绝</span>
        </div>
      </template>
      <a-form :label-col="labelCol" :wrapper-col="wrapperCol">
        <a-form-item>
          <a-descriptions title="基本信息" :label-style="itemLabel" layout="vertical" bordered :column="7" class="buisness">
            <a-descriptions-item label="姓名" :label-style="itemLabel">{{ user.realName }}</a-descriptions-item>
            <a-descriptions-item label="ID">{{ user.nurseId }}</a-descriptions-item>
            <a-descriptions-item label="性别">{{ user.sex }}</a-descriptions-item>
            <a-descriptions-item label="身份证号">{{ user.idCard }}</a-descriptions-item>
            <a-descriptions-item label="地理位置">{{ user.location }}</a-descriptions-item>
            <a-descriptions-item label="职称">{{ user.position }}</a-descriptions-item>
            <a-descriptions-item label="工作年限">{{ user.workingYears }}</a-descriptions-item>
            <a-descriptions-item label="用户来源">{{ user.registSource }}</a-descriptions-item>
            <a-descriptions-item label="资格证截止日期">{{ user.expirationDate }}</a-descriptions-item>
            <a-descriptions-item label="申请时间">{{ user.updatedAt }}</a-descriptions-item>
            <a-descriptions-item label="职业机构">{{ user.hospital }}</a-descriptions-item>
            <a-descriptions-item label="所属科室">{{ user.department }}</a-descriptions-item>
            <a-descriptions-item label="服务类目">{{ user.serviceType }}</a-descriptions-item>
            <a-descriptions-item label="服务出发地址" v-if="user.newDepartAddress">{{ user.newDepartAddress }}</a-descriptions-item>
            <a-descriptions-item label="服务出发地址" v-else>{{ user.departAddress }}</a-descriptions-item>
            <a-descriptions-item label="简介">{{ user.nurseSynopsis }}</a-descriptions-item>
          </a-descriptions>
        </a-form-item>
        <a-form-item :label="getType(0)">
          <a-image :width="100" :src="user.nursePicture" />
          <!-- <a-image :width="100" v-if="user.orderPicture" :src="user.orderPicture" /> -->
        </a-form-item>
        <a-form-item :label="getType(1)">
          <div class="df">
            <a-image :width="100" v-if="user.homePicture" :src="user.homePicture" />
            <div style="width: 20px"></div>
            <a-image :width="100" v-if="user.infoPicture" :src="user.infoPicture" />
            <div style="width: 20px"></div>
            <a-image :width="100" :src="user.orderPicture" />
          </div>
        </a-form-item>
        <a-form-item label="拒绝原因" v-if="user.status == 3">
          {{ user.reason }}
        </a-form-item>
        <!-- 审核信息 -->
        <a-form-item label="审核信息">
          <div>审核人员：{{ user.checkPerson }}</div>
          <div>审核时间：{{ user.checkTime }}</div>
        </a-form-item>
      </a-form>
      <!-- 底部内容 -->
      <a-row>
        <a-divider></a-divider>
        <template v-if="isEdit == 1">
          <a-col :span="4" :offset="6">
            <a-button type="danger" @click="reject" class="d-a-center">拒绝</a-button>
          </a-col>
          <a-col :span="4" :offset="1">
            <a-button type="primary" @click="pass" class="d-a-center">通过</a-button>
          </a-col>
        </template>
        <a-col :span="4" :offset="isEdit == 1 ? 1 : 12" v-if="isEdit == 0">
          <a-button type="info" @click="cancle" class="d-a-center">关闭</a-button>
        </a-col>
      </a-row>
    </a-card>

    <!-- 拒绝审核-->
    <a-modal :destroyOnClose="true" v-model:visible="rejectVisible" title="原因填写" @ok="handleOk" ok-text="提交" :closable="true">
      <a-form ref="reasonRef" :model="reasonForm" :rules="rules">
        <a-form-item label="主述" name="remake">
          <a-textarea v-model:value="reasonForm.remake"></a-textarea>
        </a-form-item>
      </a-form>
    </a-modal>
  </a-modal>
</template>
<script>
import { onMounted, ref, reactive, createVNode } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { Modal, notification } from 'ant-design-vue'
import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
import { selectNurseInfoCheckById, updateNurseInfoStatus } from '@/api/buisness/index'
import { useModal } from '@/hooks'

export default {
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    id: {
      type: Number,
      default: ''
    },
    isEdit: {
      type: Boolean,
      default: 0
    },
    identity: {
      default: 1
    }
  },
  components: {
    ExclamationCircleOutlined
  },

  setup(props, { emit }) {
    const router = useRouter()
    const route = useRoute()
    const isEdit = ref('')

    const reasonRef = ref('')
    const reasonForm = reactive({
      remake: ''
    })

    const user = ref('')
    const rejectVisible = ref(false)

    const rules = {
      remake: [
        {
          required: true,
          message: '请填写原因!',
          trigger: 'blur'
        }
      ]
    }
    const getType = num => {
      const obj = {
        1: '护士',
        6: '陪诊师'
      }
      const numType = {
        0: '资格证',
        1: '执业证'
      }
      return obj[props.identity] + numType[num]
    }
    const handleOk = e => {
      reasonRef.value
        .validate()
        .then(async () => {
          //    visible.value = false;
          console.log('9999999999999999', user.value.status)
          if (user.value.status == 2) {
            let obj = {
              id: props.id,
              remake: reasonForm.remake,
              status: 2,
              subStatus: 3,
              identity: props.identity
            }
            let res = await updateNurseInfoStatus(obj)
            if (res.success) {
              console.log(res)
              notification.success({
                message: '执行成功 ',
                duration: 1
              })

              rejectVisible.value = false
              cancle(true)
            }
          } else if (user.value.status == 1) {
            let obj = {
              id: props.id,
              remake: reasonForm.remake,
              status: 3,
              subStatus: 3,
              identity: props.identity
            }
            console.log(obj)
            let res = await updateNurseInfoStatus(obj)
            if (res.success) {
              console.log(res)
              notification.success({
                message: '执行成功 ',
                duration: 1
              })

              rejectVisible.value = false
              cancle(true)
            }
          }
        })
        .catch(error => {})
    }
    const reject = () => {
      rejectVisible.value = true
    }
    const cancle = e => {
      emit('closeModal', e)
    }
    const pass = () => {
      const { closeModal } = useModal.confirm({
        title: '确认通过该资格认证吗？',
        icon: createVNode(ExclamationCircleOutlined),
        okText: '确定',
        cancelText: '取消',
        onOk: async () => {
          let obj = {
            id: props.id,
            remake: reasonForm.remake,
            status: 2,
            subStatus: 2,
            identity: props.identity
          }

          let res = await updateNurseInfoStatus(obj)
          if (res.success) {
            notification.success({
              message: '执行成功 ',
              duration: 1
            })
            closeModal()
            cancle(true)
          }
        }
      })
    }
    init()
    async function init() {
      let res = await selectNurseInfoCheckById(props.id)

      if (res.success) {
        user.value = res.object
      }
    }

    onMounted(() => {})
    return {
      user,
      reasonRef,
      reasonForm,
      rejectVisible,
      rules,
      handleOk,
      reject,
      pass,
      labelCol: {
        style: {
          width: '100px',
          fontWeight: 'bolder'
        }
      },
      wrapperCol: {
        span: 20,
        offset: 1
      },
      itemLabel: {
        color: '#2a9d8f',
        fontWeight: 'bolder'
      },
      cancle,
      getType
    }
  }
}
</script>
<style scoped></style>
